<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=yes">

    <meta content="telephone=yes,email=yes" name="format-detection">
    <!--//自动识别电话号码和邮箱-->

    <meta content="yes" name="apple-mobile-web-app-capable">
    <!--//苹果手机：会删除默认的工具栏和菜单栏，网站开启对web app程序的支持-->
    <meta name="apple-mobile-web-app-status-bar-style" content="default"/>
    <!--//苹果手机：在web app应用下状态条（屏幕顶部条）的颜色,默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。-->
    <meta name="apple-touch-fullscreen" content="yes"/>
    <!--//苹果手机：如果把一个web app添加到了主屏幕中，那么从主屏幕中打开这个web app则全屏显示-->
    <link rel="apple-touch-icon" href="images/HTML5_Badge_64.png"/>
    <!--//苹果手机：将应用添加到手机主屏幕，会有一个icon可以直接进入-->
    <title>有收入</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <!--初始化样式-->
    <link rel="stylesheet" href="css/reset.css">
    <!--共用样式-->
    <link rel="stylesheet" href="css/common.css">
    <!--整个网站的局部样式-->
    <link rel="stylesheet" href="css/style.css">
    <!--适配样式-->
    <link rel="stylesheet" href="css/styleMedia.css">

</head>

<body>

<!--header begin-->
<header>
    <div id="flexHeader">
         <div class="div1 mui-action-back"><a><img src="images/icon_arrow_left.png"></a></div>
        <div class="div2">忘记密码</div>
        <div class="div3"></div>
    </div>
</header>
<!--header end-->
<br>
<!--login begin-->
<article class="clearfix login">
    <form action="" method="post">
        <div class="tel-login">
            <input type="search" class="ifFree" id="userTel" name="userTel" placeholder="请您输入手机登录账号"  >
        </div>
        <div class="verification-code">
            <input id="code"  name="search" class="ifFree" type="search" placeholder="验证码"   >
            <div style="display: flex; justify-content: flex-end;margin-top: -0.8rem">
                <input id="btnSendCode"  type="button" style="width: 1.86rem;height: 0.59rem; background-color:#1e81d2; font-size: 0.28rem;text-align: center;line-height: 0.59rem;color: #fff; display: inline-flex;  -webkit-border-radius: 0.1rem; border-radius: 0.1rem; justify-content: center; " value="请输入验证码" onClick="sendMessage()" />
            </div>
        </div>
        <div class="pwd-login">
            <input name="search" class="ifFree" id="newPassword" type="search" autofocus placeholder="请输入新密码" onmouseleave="checkInput()" oninput="changeBtnable()">
        </div>


        <div class="info1" id="box2"></div>
        <button type='button' id="summitBut" class="user-login-btn" >提交</button>
    </form>


</article>
<!--login end-->

<!--js-->

<!--<script src="js/vconsole.min.js"></script>-->
<!--<script>-->
<!--var vConsole = new VConsole();-->
<!--console.log('hello');-->
<!--</script>-->
<script src="js/jquery-1.12.3.min.js"></script>
<script src="js/common.js"></script>
<script src="js/mui.min.js"></script>
<script src="js/config.js"></script>
<script>
	$("#btnSendCode").attr("disabled","disabled");
	$("#btnSendCode").css("background-color","#d3d3d3");
</script>
<script type="text/javascript">
    var InterValObj; //timer变量，控制时间
    var count = 30; //间隔函数，1秒执行
    var curCount;//当前剩余秒数
    var code = ""; //验证码
    var codeLength = 6;//验证码长度
    function sendMessage() {
        curCount = count;
        var dealType; //验证方式
        var uid=$("#uid").val();//用户uid
        if ($("#phone").attr("checked") == true) {
            dealType = "phone";
        }
        else {
            dealType = "email";
        }
//产生验证码
        for (var i = 0; i < codeLength; i++) {
            code += parseInt(Math.random() * 9).toString();
        }
//设置button效果，开始计时
        $("#btnSendCode").attr("disabled", "true");
        $("#btnSendCode").val( + curCount + "秒再获取");
        InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
//向后台发送处理数据
        $.ajax({
            type: "POST", //用POST方式传输
            url: $CONFIG.baseUrl + '/api/getSmsCode', //目标地址
			data:{
				"phone" : $("#userTel").val()
			},
            error: function (data) {console.log(JSON.stringify(data)) },
            success: function (msg){console.log(JSON.stringify(msg)) }
        });
    }
	$("#userTel").blur(function(){
		var tel123 = $("#userTel").val();
		var fle = /^1[345789]\d{9}$/;
		if(fle.test(tel123) ){
			$.ajax({
				url:$CONFIG.baseUrl + '/api/verifyPhone',
				type:"post",
				data:{
					"phone":tel123,
				},
				success:function(data){
					console.log(JSON.stringify(data));
					if(data.code==500){
						alert("该号码未注册，请先注册");
						$("#btnSendCode").attr("disabled","disabled");
						$("#btnSendCode").css("background-color","#d3d3d3");
					}else if(data.code==200){
						$("#btnSendCode").removeAttr("disabled");
						$("#btnSendCode").css("background-color","#1e81d2");
					}
				},
				error:function(){
					alert("错误");
				}	
			})
		}else{
			alert("请输入正确的手机号")
		}
		
		
		
	});
    //timer处理函数
    function SetRemainTime() {
        if (curCount == 0) {
            window.clearInterval(InterValObj);//停止计时器
            $("#btnSendCode").removeAttr("disabled");//启用按钮
            $("#btnSendCode").val("重新发送");
            code = ""; //清除验证码。如果不清除，过时间后，输入收到的验证码依然有效
        }
        else {
            curCount--;
            $("#btnSendCode").val( + curCount + "秒再获取");
        }
    }
</script>
<script language="JavaScript" type="text/javascript">
	$("#summitBut").click(function() {
		if ($("#userTel").val() == '' || $("#newPassword").val() == '' || $("#code").val() == ''){
			alert("请完善表单中的内容");
			console.log("请完善表单中的内容");
			
		}else{
			$.ajax({
				url: $CONFIG.baseUrl + '/api/forgetPassword',
				type: 'post',
				
				data:{
					'phone' : $("#userTel").val(),
					'newPassword' : $("#newPassword").val(),
					'newCode' : $("#code").val(),
				},
				dataType: 'json',
				success: function(data) {
					console.log(JSON.stringify(data));
					alert("修改成功");
					mui.back();
				},
				error: function(data) {
					console.log(JSON.stringify(data))
					alert("错误，请您重新操作！");
				}
				
			})
		}
	})
    function checkInput(){
        var text = $("input").val();
        if(text==null||text==""){
            changeBtndisable();
        }
    }
    function changeBtndisable(){
        $("#summitBut").addClass("user-login-btn");
        $("#summitBut").attr("disabled","true");
    }


    function changeBtnable(){
        $("#summitBut").removeAttr("disabled").removeClass("user-login-btn");
        $("#summitBut").addClass("user-login-btn-selected");

    }
</script>
</body>
</html>